<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="description" content="Metro, a sleek, intuitive, and powerful framework for faster and easier web development for Windows Metro Style.">
    <meta name="keywords" content="HTML, CSS, JS, JavaScript, framework, metro, front-end, frontend, web development">
    <meta name="author" content="Sergey Pimenov and Metro UI CSS contributors">
    <title>Bookloft -- {% block title %} {% endblock %}</title>
    <link rel="stylesheet" href="//cdn.bootcss.com/metro/3.0.17/css/metro.min.css" />
    <link rel="stylesheet" href="//cdn.bootcss.com/metro/3.0.17/css/metro-icons.min.css" />
    <link rel="stylesheet" href="//cdn.bootcss.com/metro/3.0.17/css/metro-responsive.min.css" />
    {% load static %}
    <link rel="stylesheet" href="{% static 'base.css' %}" />
  </head>
<body class="bg-darkTeal">
  {% block body %}
  {% endblock %}
    <script type="text/javascript" src="//cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
    <script type="text/javascript" src="//cdn.bootcss.com/datatables/1.10.13/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src="//cdn.bootcss.com/metro/3.0.17/js/metro.min.js"></script>
    <script type="text/javascript">
    $(function(){
            var form = $(".login-form");
            form.css({
                opacity: 1,
                "-webkit-transform": "scale(1)",
                "transform": "scale(1)",
                "-webkit-transition": ".5s",
                "transition": ".5s"
            });
        });

        {% if error %}
        $.Notify({
            //caption: '出错',
            content: '{{error}}',
            type: 'alert'
        });
        {% endif %}
    </script>
</body>
</html>
